<template>
  <div class="tool-box">
    筛选条件:
    <el-select v-model="value" placeholder="任务状态">
      <el-option
        v-for="item in options"
        :key="item.value"
        :label="item.label"
        :value="item.value">
      </el-option>
    </el-select>
    <el-select v-model="value" placeholder="任务类型">
      <el-option
        v-for="item in options"
        :key="item.value"
        :label="item.label"
        :value="item.value">
      </el-option>
    </el-select>
    <el-select v-model="value" placeholder="筛选">
      <el-option
        v-for="item in options"
        :key="item.value"
        :label="item.label"
        :value="item.value">
      </el-option>
    </el-select>
    <el-input placeholder="任务说明" class="input-with-select" style="width:200px">
       <el-button slot="append" icon="el-icon-search"></el-button>
     </el-input>

    <el-button type="primary">重置条件</el-button>
   <el-button type="primary" @click="task_add()">+ 新增任务</el-button>
  </div>
 
</template>
<script>
export default {
  props:[""],
  data(){
    return{
      options: [{
        value: '选项1',
        label: '黄金糕'
      }, {
        value: '选项2',
        label: '双皮奶'
      }, {
        value: '选项3',
        label: '蚵仔煎'
      }, {
        value: '选项4',
        label: '龙须面'
      }, {
        value: '选项5',
        label: '北京烤鸭'
      }],
      value:''
    }
  },
  methods:{
    task_add(){
      alert(3)
    }
  }
}
</script>
<style scoped lang="scss">
  @import "./style.scss";
  .fr{
    float: right;
  }
</style>
